<template>
    <div class="srbd">

        <div class="bd">
            <div class="cesaun_container">
                <h3 class="title">
                    <p class="line">八字合婚</p>
                </h3>
                <div>
                    <div>
                        <div style="text-align: center;font-size: 14px;color: #ccc;margin-bottom: 20px;">
                            -------------------------女方信息---------------------</div>
                        <el-form :model="form" ref="form" label-width="120px" label-position="right">
                            <!-- 姓名 -->
                            <el-form-item label="姓名：" prop="name">
                                <el-input v-model="form.name" placeholder="请输入姓名" clearable
                                    style="width: 450px"></el-input>
                            </el-form-item>
                            <el-form-item label="性别：" prop="sex">
                                <el-radio-group v-model="form.sex">
                                    <el-radio label="男">男</el-radio>
                                    <el-radio label="女">女</el-radio>
                                </el-radio-group>
                            </el-form-item>
                            <el-form-item label="历法：" prop="type">
                                <el-radio-group v-model="form.type">
                                    <el-radio label="1">阳历</el-radio>
                                    <el-radio label="0">农历</el-radio>
                                </el-radio-group>
                            </el-form-item>
                            <!-- 生日 -->
                            <el-form-item label="生日：" prop="birthday">
                                <el-date-picker v-model="form.birthday" @change="dateBir" type="datetime"
                                    placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss"
                                    style="width: 450px"></el-date-picker>
                            </el-form-item>
                        </el-form>
                        <div style="text-align: center;font-size: 14px;color: #ccc;margin-bottom: 20px;">
                            -------------------------男方信息---------------------</div>
                        <el-form :model="formBy" ref="form" label-width="120px" label-position="right">
                            <!-- 历法选择 -->


                            <el-form-item label="姓名：" prop="name">
                                <el-input v-model="formBy.name" placeholder="请输入姓名" clearable
                                    style="width: 450px"></el-input>
                            </el-form-item>
                            <el-form-item label="性别：" prop="sex">
                                <el-radio-group v-model="formBy.sex">
                                    <el-radio label="男">男</el-radio>
                                    <el-radio label="女">女</el-radio>
                                </el-radio-group>
                            </el-form-item>
                            <!-- 生日 -->
                            <el-form-item label="生日：" prop="birthday">
                                <el-date-picker v-model="formBy.birthday" @change="dateBirBoy" type="datetime"
                                    placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss"
                                    style="width: 450px"></el-date-picker>
                            </el-form-item>

                            <!-- 历法选择 -->
                            <el-form-item label="历法：" prop="type">
                                <el-radio-group v-model="formBy.type">
                                    <el-radio label="1">阳历</el-radio>
                                    <el-radio label="0">农历</el-radio>
                                </el-radio-group>
                            </el-form-item>
                            <el-form-item label="语言：" prop="lang">
                                <el-radio-group v-model="form.lang">
                                    <el-radio label="zh-cn">中文</el-radio>
                                    <el-radio label="en-us">英文</el-radio>
                                    <el-radio label="zh-tw">繁体</el-radio>

                                </el-radio-group>
                            </el-form-item>
                            <!-- 太阳时 -->


                            <!-- 出生地区 -->



                        </el-form>
                    </div>

                </div>
                <div style="text-align: center;">
                    <el-button type="primary" @click="submitForm" style="margin:20px">立即测算</el-button>
                </div>

                <!-- 主体表单 -->

            </div>
            <div>
                <h3 class="title">
                    <p class="line">测算简介</p>
                </h3>
                <div style="font-size: 14px;margin: 0 10px 20px 10px;">

                    <p style="">
                        1.寻经问道八字合婚可以双方的生辰八字来以本命卦合婚论吉凶，测算结果仅供参考。
                    </p>
                    <p>
                        2.八字，即生辰八字，是一个人出生时的干支历日期。年干和年支组成年柱，月干和月支组成月柱，日干和日支组成日柱，时干和时支组成时柱，一共四柱，四个干和四个支共八个字，故又称四柱八字。是算命方法之中最正统的一种。
                    </p>
                    <p>
                        3.中国古代一个时辰等于现在的两个小时，比如午时，即现代时间的11时到13时之间。八字算命只需准确到时辰范围（两个小时之间）即可，不必精确到分钟。
                    </p>
                    <p>
                        4.八字合婚多少分好？我们认为，两个人的生辰八字合婚，没有绝对完美的配对。很多生肖相冲的夫妻，也磕磕绊绊的一起度过一生。所以八字合婚50分以上为即可，另外，本八字合婚程序，只是测试了两个人的生辰八字一部份信息，所以八字配合婚指数仅供参考。更准确的八字合婚，还需要周易专家进行全盘的人工分析。
                    </p>

                </div>
            </div>
        </div>
        <el-dialog title="测算结果" :visible.sync="centerDialogVisible" width="50%" class="dialog_cesuan">
            <template>
                <div class="bazi_info">

                    <div class="base_info">
                        <div class="title">
                            <span class="shu"></span>
                            <span class="ti">男方命盘</span>
                        </div>
                        <div class="show">
                            <span class="l">八字:</span>
                            <span class="r">{{ result.male.bazi[0].trim() }}年</span>
                            <span> {{ result.male.bazi[1].trim() }}月</span>
                            <span> {{ result.male.bazi[2].trim() }}日</span>
                        </div>
                        <div class="show">
                            <span class="l">姓名:</span>
                            <span class="r">{{ result.male.name }}</span>
                        </div>
                        <div class="show">
                            <span class="l">出生公历:</span>
                            <span class="r">{{ result.male.gongli }}</span>
                        </div>
                        <div class="show">
                            <span class="l">星座:</span>
                            <span class="r">{{ result.male_xz }}</span>
                        </div>
                        <div class="show">
                            <span class="l">生肖:</span>
                            <span class="r">{{ result.male_sx }}</span>
                        </div>
                        <div class="show">
                            <span class="l">纳音:</span>
                            <span class="r">{{ result.male.na_yin.toString() }}</span>
                        </div>
                    </div>
                    <div class="table">
                        <div class="list-content">
                            <div class="tr1">
                                <div class="tr1_w">
                                    <span class="">#</span>
                                </div>
                                <div class="" v-for="(tr1, index) in result.male.tg_cg_god" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                            <div class="tr2">
                                <div class="tr1_w">
                                    <span style="font-weight: 800;">乾造</span>
                                </div>
                                <div class="" v-for="(tr1, index) in result.male.bazi" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>{{ (result.male.kw + '空') }}</span>
                                </div>
                            </div>
                            <div class="tr3">
                                <div class="tr1_w">
                                    <span style="font-weight: 800;">藏干</span>
                                </div>
                                <div class="" v-for="(tr1, index) in result.male.dz_cg" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                            <div class="tr3">
                                <div class="tr1_w">
                                    <span> </span>
                                </div>
                                <div class="item_w" v-for="(tr1, index) in result.male.dz_cg_god" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                            <div class="tr3">
                                <div class="tr1_w">
                                    <span style="font-weight: 800;">衰旺</span>
                                </div>
                                <div class="item_w" v-for="(tr1, index) in result.male.day_cs" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                            <div class="tr3" style="border-bottom: none;">
                                <div class="tr1_w">
                                    <span style="font-weight: 800;">纳音</span>
                                </div>
                                <div class="item_w_nayin" v-for="(tr1, index) in result.male.na_yin" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="base_info">
                        <div class="title">
                            <span class="shu"></span>
                            <span class="ti">女方命盘</span>
                        </div>
                        <div class="show">
                            <span class="l">八字:</span>
                            <span class="r">{{ result.female.bazi[0].trim() }}年</span>
                            <span> {{ result.female.bazi[1].trim() }}月</span>
                            <span> {{ result.female.bazi[2].trim() }}日</span></span>

                        </div>
                        <div class="show">
                            <span class="l">姓名:</span>
                            <span class="r">{{ result.female.name }}</span>
                        </div>
                        <div class="show">
                            <span class="l">出生公历:</span>
                            <span class="r">{{ result.female.gongli }}</span>
                        </div>
                        <div class="show">
                            <span class="l">星座:</span>
                            <span class="r">{{ result.female_xz }}</span>
                        </div>
                        <div class="show">
                            <span class="l">生肖:</span>
                            <span class="r">{{ result.female_sx }}</span>
                        </div>
                        <div class="show">
                            <span class="l">纳音:</span>
                            <span class="r">{{ result.female.na_yin.toString() }}</span>
                        </div>
                    </div>
                    <div class="table">
                        <div class="list-content">
                            <div class="tr1">
                                <div class="tr1_w">
                                    <span class="">#</span>
                                </div>
                                <div class="" v-for="(tr1, index) in result.female.tg_cg_god" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                            <div class="tr2">
                                <div class="tr1_w">
                                    <span style="font-weight: 800;">乾造</span>
                                </div>
                                <div class="" v-for="(tr1, index) in result.female.bazi" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>{{ (result.female.kw + '空') }}</span>
                                </div>
                            </div>
                            <div class="tr3">
                                <div class="tr1_w">
                                    <span style="font-weight: 800;">藏干</span>
                                </div>
                                <div class="" v-for="(tr1, index) in result.female.dz_cg" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                            <div class="tr3">
                                <div class="tr1_w">
                                    <span> </span>
                                </div>
                                <div class="item_w" v-for="(tr1, index) in result.female.dz_cg_god" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                            <div class="tr3">
                                <div class="tr1_w">
                                    <span style="font-weight: 800;">衰旺</span>
                                </div>
                                <div class="item_w" v-for="(tr1, index) in result.female.day_cs" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                            <div class="tr3" style="border-bottom: none;">
                                <div class="tr1_w">
                                    <span style="font-weight: 800;">纳音</span>
                                </div>
                                <div class="item_w_nayin" v-for="(tr1, index) in result.female.na_yin" :key="index">
                                    <span>{{ tr1 }}</span>
                                </div>
                                <div class="tr1_w">
                                    <span>#</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="base_info">
                        <div class="title">
                            <span class="shu"></span>
                            <span class="ti">合婚结果</span>
                        </div>

                        <div class="details">
                            <div class="names">
                                <span>命宫：</span>
                                <span>{{ result.minggong.score }}分</span>
                            </div>
                            <div class="des">
                                <span class="des_text">说明</span>
                                <span class="des_deta">{{ result.minggong.description }}</span>
                            </div>
                            <div class="des">
                                <span class="des_text">详批</span>
                                <span class="des_deta">{{ result.minggong.detail_description }}</span>
                            </div>
                        </div>
                        <div class="details">
                            <div class="names">
                                <span>年支同气：</span>
                                <span>{{ result.nianqitongzhi.score }}分</span>
                            </div>
                            <div class="des">
                                <span class="des_text">说明</span>
                                <span class="des_deta">{{ result.nianqitongzhi.description }}</span>
                            </div>
                            <div class="des">
                                <span class="des_text">详批</span>
                                <span class="des_deta">{{ result.nianqitongzhi.detail_description }}</span>
                            </div>
                        </div>
                        <div class="details">
                            <div class="names">
                                <span>月令合：</span>
                                <span>{{ result.yueling.score }}分</span>
                            </div>
                            <div class="des">
                                <span class="des_text">说明</span>
                                <span class="des_deta">{{ result.yueling.description }}</span>
                            </div>
                            <div class="des">
                                <span class="des_text">详批</span>
                                <span class="des_deta">{{ result.yueling.detail_description }}</span>
                            </div>
                        </div>
                        <div class="details">
                            <div class="names">
                                <span>日干相合：</span>
                                <span>{{ result.rigan.score }}分</span>
                            </div>
                            <div class="des">
                                <span class="des_text">说明</span>
                                <span class="des_deta">{{ result.rigan.description }}</span>
                            </div>
                            <div class="des">
                                <span class="des_text">详批</span>
                                <span class="des_deta">{{ result.rigan.detail_description }}</span>
                            </div>
                        </div>

                        <div class="details">
                            <div class="names">
                                <span>天干五合：</span>
                                <span>{{ result.tiangan.score }}分</span>
                            </div>
                            <div class="des">
                                <span class="des_text">说明</span>
                                <span class="des_deta">{{ result.tiangan.description }}</span>
                            </div>
                            <div class="des">
                                <span class="des_text">详批</span>
                                <span class="des_deta">{{ result.tiangan.detail_description }}</span>
                            </div>
                        </div>

                        <div class="details">
                            <div class="names">
                                <span>子女同步：</span>
                                <span>{{ result.zinv.score }}分</span>
                            </div>
                            <div class="des">
                                <span class="des_text">说明</span>
                                <span class="des_deta">{{ result.zinv.description }}</span>
                            </div>
                            <div class="des">
                                <span class="des_text">详批</span>
                                <span class="des_deta">{{ result.zinv.detail_description }}</span>
                            </div>
                        </div>
                        <div class="details">
                            <div class="names">
                                <span>总分数：</span>
                                <span>{{ result.all_score }}分</span>
                            </div>
                        </div>

                    </div>
                    <div class="yl">
                        <span>仅供娱乐！请勿当真</span>
                    </div>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<script>
export default {
  computed: {
    currentPath() {
      return this.$route.path; // 获取当前路由路径
    },
  },
  data() {
    return {
      centerDialogVisible: false,
      birthday: "",

      result: {
        male: {
          bazi: [
            //男方八字
            "戊辰", //男方八字【年】
            "癸亥", //男方八字【月】
            "丁卯", //男方八字【日】
            "丙午", //男方八字【时】
          ],
          gl_year: "1988", //男方公历年
          gl_month: "11", //男方公历月
          gl_day: "8", //男方公历日
          gl_hours: "12", //男方公历时
          sex: "乾造", //性别
          name: "张三", //男方姓名
          gongli: "1988年11月8日12时20分", //男方公历年月日时分
          kw: "戌亥", //男方空亡
          tg_cg_god: [
            //男方天干十神
            "伤", //男方天干十神【年】
            "杀", //男方天干十神【月】
            "日元", //男方天干十神【日】
            "劫", //男方天干十神【时】
          ],
          dz_cg: [
            //男方地支藏干
            "戊|乙|癸", //男方地支藏干【年】
            "壬|甲", //男方地支藏干【月】
            "乙", //男方地支藏干【月】
            "丁|己", //男方地支藏干【时】
          ],
          dz_cg_god: [
            //男方地支藏干十神
            "伤|枭|杀", //男方地支藏干十神【年】
            "官|印", //男方地支藏干十神【月】
            "枭", //男方地支藏干十神【月】
            "比|食", //男方地支藏干十神【时】
          ],
          day_cs: [
            //男方八字长生衰旺
            "衰", //男方八字长生衰旺【年】
            "胎", //男方八字长生衰旺【月】
            "病", //男方八字长生衰旺【日】
            "临官", //男方八字长生衰旺【时】
          ],
          na_yin: [
            //男方八字纳音
            "大林木", //男方八字纳音【年】
            "大海水", //男方八字纳音【月】
            "炉中火", //男方八字纳音【日】
            "天河水", //男方八字纳音【时】
          ],
        },
        female: {
          bazi: [
            //女方八字
            "戊辰", //女方八字【年】
            "癸亥", //女方八字【月】
            "丁卯", //女方八字【日】
            "丙午", //女方八字【时】
          ],
          gl_year: "1988", //女方公历年
          gl_month: "11", //女方公历月
          gl_day: "8", //女方公历日
          gl_hours: "12", //女方公历时
          sex: "坤造", //性别
          name: "李四", //女方姓名
          gongli: "1988年11月8日12时20分", //女方公历年月日时分
          kw: "戌亥", //女方空亡
          tg_cg_god: [
            //女方天干十神
            "伤", //女方天干十神【年】
            "杀", //女方天干十神【月】
            "日元", //女方天干十神【日】
            "劫", //女方天干十神【时】
          ],
          dz_cg: [
            //女方地支藏干
            "戊|乙|癸", //女方地支藏干【年】
            "壬|甲", //女方地支藏干【月】
            "乙", //女方地支藏干【日】
            "丁|己", //女方地支藏干【时】
          ],
          dz_cg_god: [
            //女方地支藏干十神
            "伤|枭|杀", //女方地支藏干十神【年】
            "官|印", //女方地支藏干十神【月】
            "枭", //女方地支藏干十神【日】
            "比|食", //女方地支藏干十神【时】
          ],
          day_cs: [
            //女方八字长生衰旺
            "衰", //女方八字长生衰旺【年】
            "胎", //女方八字长生衰旺【月】
            "病", //女方八字长生衰旺【日】
            "临官", //女方八字长生衰旺【时】
          ],
          na_yin: [
            //女方八字纳音
            "大林木", //女方八字纳音【年】
            "大海水", //女方八字纳音【月】
            "炉中火", //女方八字纳音【日】
            "天河水", //女方八字纳音【时】
          ],
        },
        minggong: {
          //合婚命宫
          male_fengshui: "",
          female_fengshui: "",
          score: "30", //合婚命宫打分
          male_minggong: "震",
          female_minggong: "震",
          description: "。",
          detail_description: "", //命宫详细批示
        },
        nianqitongzhi: {
          //年支同气
          score: "20", //年支同气打分
          male_nian_zhi: "辰",
          male_nian_zhi_desc: "木",
          female_nian_zhi: "辰",
          female_nian_zhi_desc: "木",
          description: "",
          detail_description: "", //年气同支详细批示
        },
        yueling: {
          //月令合
          score: "5", //月令合打分
          male_yue_zhi: "亥",
          female_yue_zhi: "亥",
          description: "",
          detail_description: "", //月令合详细批示
        },
        rigan: {
          //日干相合
          score: "25", //日干相合打分
          male_yue_zhi: "丁",
          female_yue_zhi: "丁",
          description: "。",
          detail_description: "", //日干相合详细批示
        },
        tiangan: {
          //天干五合
          score: "5", //天干五合打分
          male_yue_zhi: "丁",
          female_yue_zhi: "丁",
          description: "",
          detail_description: "", //天干五合详细批示
        },
        zinv: {
          //子女同步
          nannv: "男", //生男生女
          score: "15", //子女同步打分
          description: "",
          detail_description: "", //子女同步详细批示
        },
        all_score: 100, //合婚总分
        male_sx: "龙", //男方生肖
        female_sx: "龙", //女方生肖
        male_xz: "天蝎座", //男方星座
        female_xz: "天蝎座", //女方星座
      },
      area: "",
      form: {
        name: "",
        birthday: "",
        type: "1",

        sex: "男",
        year: "",
        month: "",
        day: "",

        hours: "",
        minute: "",
      },
      formBy: {
        name: "",

        type: "1",
        lang: "zh-cn",
        birthday: "",
        sex: "男",
        year: "",
        month: "",
        day: "",

        hours: "",
        minute: "",
      },

      rules: {
        name: [
          { required: true, message: "请输入姓名", trigger: "blur" },
          {
            min: 2,
            max: 10,
            message: "长度在 2 到 10 个字符",
            trigger: "blur",
          },
        ],
        sex: [{ required: true, message: "请选择性别", trigger: "change" }],

        type: [
          { required: true, message: "请选择历法类型", trigger: "change" },
        ],
      },
    };
  },
  mounted() {
    // this.getCurrentDate();
    let formBz = JSON.parse(localStorage.getItem("arrangeEightFormStorage"));
    console.log(formBz);
    if (formBz) {
      if (formBz.sex == 0) {
        this.formBy.name = formBz.name;
        this.formBy.sex = formBz.sex == 0 ? "男" : "女";
        this.formBy.type = formBz.isLunar == 0 ? "1" : "0";
      } else {
        this.form.name = formBz.nameBy;
        this.form.sex = formBz.sex == 0 ? "男" : "女";
        this.form.type = formBz.isLunar == 0 ? "1" : "0";
      }
      if (formBz.isLunar == 0) {
        if (this.form.sex == "女") {
          this.form.year = formBz.year;
          this.form.month = formBz.month;
          this.form.day = formBz.day;
          this.form.hours = this.padZero(formBz.hours);
          this.form.minute = this.padZero(formBz.minute);
          this.form.birthday =
            this.form.year +
            "-" +
            this.form.month +
            "-" +
            this.form.day +
            "" +
            this.form.hours +
            ":" +
            this.form.minute +
            ":00";
        } else {
          this.formBy.year = formBz.year;
          this.formBy.month = formBz.month;
          this.formBy.day = formBz.day;
          this.formBy.hours = this.padZero(formBz.hours);
          this.formBy.minute = this.padZero(formBz.minute);
          this.formBy.birthday =
            this.form.year +
            "-" +
            this.form.month +
            "-" +
            this.form.day +
            "" +
            this.form.hours +
            ":" +
            this.form.minute +
            ":00";
        }
      }
    }
  },
  methods: {
    dateBirBoy(val) {
      console.log(val);
      this.formBy.birthday = val;
      var date = new Date(val);

      // 获取各部分时间
      var year = date.getFullYear(); // 年（4位）
      var month = (date.getMonth() + 1).toString().padStart(2, "0"); // 月（补零）
      var day = date.getDate().toString().padStart(2, "0"); // 日（补零）
      var hours = date.getHours().toString().padStart(2, "0"); // 时（补零）
      var minutes = date.getMinutes().toString().padStart(2, "0"); // 分（补零）

      this.formBy.year = year;
      this.formBy.month = month;
      this.formBy.day = day;
      this.formBy.hours = hours;
      this.formBy.minute = minutes;
    },
    padZero(num) {
      return num.toString().padStart(2, "0");
    },
    dateBir(val) {
      console.log(val);
      this.form.birthday = val;

      var date = new Date(val);

      // 获取各部分时间
      var year = date.getFullYear(); // 年（4位）
      var month = (date.getMonth() + 1).toString().padStart(2, "0"); // 月（补零）
      var day = date.getDate().toString().padStart(2, "0"); // 日（补零）
      var hours = date.getHours().toString().padStart(2, "0"); // 时（补零）
      var minutes = date.getMinutes().toString().padStart(2, "0"); // 分（补零）

      this.form.year = year;
      this.form.month = month;
      this.form.day = day;
      this.form.hours = hours;
      this.form.minute = minutes;
    },

    submitForm() {
      if (!this.form.name) {
        this.$message.error("请输入姓名(女)");
        return false;
      }
      if (!this.form.birthday) {
        this.$message.error("请选择生日(女)");
        return false;
      }
      if (!this.formBy.name) {
        this.$message.error("请输入姓名(男)");
        return false;
      }
      if (!this.formBy.birthday) {
        this.$message.error("请选择生日(男)");
        return false;
      }

      let parmas = {
        api_key: "FNcQHQuf0W8wDrXMjWc0xqTzw",
        male_name: this.form.name,
        male_type: this.form.type,
        male_year: this.form.year,
        male_month: this.form.month,
        male_day: this.form.day,
        male_hours: this.form.hours,
        male_minute: this.form.minute,

        female_name: this.formBy.name,
        female_type: this.formBy.type,
        female_year: this.formBy.year,
        female_month: this.formBy.month,
        female_day: this.formBy.day,
        female_hours: this.formBy.hours,
        female_minute: this.formBy.minute,

        language: this.formBy.lang,
      };
      console.log(parmas);

      let config = {
        headers: {
          "Content-Type": "application/x-www-form-urlencoded",
        },
      };
      this.$axios
        .post(window.config.apiUrl + "/v1/Bazi/hehun", parmas, config)
        .then((res) => {
          if (res.data.errcode == -1) {
            this.$message({
              type: "warning",
              message: res.data.errmsg,
            });

            return;
          }

          this.centerDialogVisible = true;
          this.result = res.data.data;
          console.log(this.result);
        });
    },
  },
};
</script>

<style scoped lang="scss">
.bd {
  border: 1px solid #e5e5e5;
}

.cesaun_container {
}

::v-deep .el-card.is-always-shadow {
  box-shadow: none !important;
}

::v-deep .el-card__header {
  padding: 10px 20px !important;
}

.form-card {
  width: 100%;
  margin: 0 auto;
  border-radius: 2px;
}

.form-title {
  margin: 0;
  color: #303133;
  font-size: 16px;
  text-align: left;
}

.el-form-item {
  margin-bottom: 22px;
}

.el-radio {
  margin-right: 30px;
}

::v-deep .distpicker-address-wrapper {
  width: 100% !important;
}

@mixin flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px;
  height: 45px;
}

@mixin tr1_w {
  width: 33px;
  text-align: center;
}

::v-deep .el-dialog__body {
  padding: 0;
}

::v-deep .el-dialog {
  margin-top: 10px !important;
}

.dialog_cesuan {
  margin-top: 0 !important;
  overflow: hidden;

  .bazi_info {
    height: calc(100vh - 100px);
    overflow: auto;

    .base_info {
      margin: 20px;

      .title {
        display: flex;
        padding: 5px;

        .shu {
          width: 5px;
          height: 20px;
          background-color: #e6a84b;
          border-radius: 10px;
        }

        .ti {
          padding-left: 8px;
          font-weight: 800;
          font-size: 15px;
        }
      }

      .show {
        margin-top: 15px;

        .l_ {
          font-size: 14px;
          display: inline-block;
          min-width: 50px;
          font-weight: 800;
        }

        .l {
          font-size: 15px;
          display: inline-block;
          min-width: 80px;
          font-weight: 800;
        }
      }

      .details {
        border: 1px solid #e5e5e5;
        border-bottom: none;
        margin-top: 20px;

        .names {
          text-align: center;
          color: #e6a84b;
          border-bottom: 1px solid #e5e5e5;
          color: #e6a84b;
          font-weight: 800;
          background-color: #fff3ef;
          height: 50px;
          line-height: 50px;
        }

        .des {
          border-bottom: 1px solid #e5e5e5;
          padding-left: 10px;
          display: flex;
          align-items: center;

          .des_text {
            color: #e6a84b;
            width: 14%;
            font-weight: 800;
            user-select: text;
          }

          .des_deta {
            width: 85%;
            line-height: 26px;
            text-indent: 2em;
            user-select: text;
          }
        }
      }
    }

    .table {
      .list-content {
        width: 100%;

        .tr1 {
          .tr1_w {
            width: 33px;
            text-align: center;
          }

          view {
            color: #1c04cc;
            font-weight: 600;
          }

          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 8px;
          height: 45px;
          // height: 50px;
          border-bottom: 1px solid #ccc;
        }

        .tr2 {
          .tr1_w {
            width: 33px;
            text-align: center;
          }

          view {
            color: red;
          }

          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 8px;
          height: 45px;
          // height: 50px;
          border-bottom: 1px solid #ccc;
        }

        .tr3 {
          .tr1_w {
            width: 33px;
            text-align: center;
          }

          .item_w {
            width: 60px;
            text-align: center;
          }

          .item_w_nayin {
            color: green;
          }

          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 8px;
          height: 45px;
          // height: 50px;
          border-bottom: 1px solid #ccc;
        }
      }
    }
  }
}
</style>